<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>

		<!-- 导入css样式 -->
		<link href="../lib/css/bootstrap.min.css" rel="stylesheet" />

		<!-- 导入jQuery库 -->
		<script type="text/javascript" src="../lib/jquery/jquery-1.11.3.min.js"></script>

		<!-- 导入js库 -->
		<script type="text/javascript" src="../lib/js/bootstrap.min.js"></script>

	</head>

	<body>

	<!-- 字形图标样式 -->
	<p>
		<button type="button" class="btn btn-default">
	      <span class="glyphicon glyphicon-sort-by-attributes"></span>
	   </button>
		<button type="button" class="btn btn-default">
	      <span class="glyphicon glyphicon-sort-by-attributes-alt"></span>
	   </button>
		<button type="button" class="btn btn-default">
	      <span class="glyphicon glyphicon-sort-by-order"></span>
	   </button>
		<button type="button" class="btn btn-default">
	      <span class="glyphicon glyphicon-sort-by-order-alt"></span>
	   </button>
	</p>
	
		<button type="button" class="btn btn-default btn-lg">
		  <span class="glyphicon glyphicon-user"></span> User
		</button>
		
		<button type="button" class="btn btn-default btn-sm">
		  <span class="glyphicon glyphicon-user"></span> User
		</button>
		
		<button type="button" class="btn btn-default btn-xs">
		  <span class="glyphicon glyphicon-user"></span> User
		</button>
		
		<button type="button" class="btn btn-primary btn-lg" style="color: rgb(212, 106, 64);">
		  <span class="glyphicon glyphicon-user"></span> User
		</button>
		
		<!-- 导航栏图标样式 -->
		<div class="navbar navbar-fixed-top navbar-inverse" role="navigation">
			<div class="container">
				<div class="navbar-header">
					<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
			            <span class="sr-only">Toggle navigation</span>
			            <span class="icon-bar"></span>
			            <span class="icon-bar"></span>
			            <span class="icon-bar"></span>
		            </button>
					<a class="navbar-brand" href="#">Project name</a>
				</div>
				<div class="collapse navbar-collapse">
					<ul class="nav navbar-nav">
						<li class="active">
							<a href="#"><span class="glyphicon glyphicon-home">Home</span></a>
						</li>
						<li>
							<a href="#shop"><span class="glyphicon glyphicon-shopping-cart">Shop</span></a>
						</li>
						<li>
							<a href="#support"><span class="glyphicon glyphicon-headphones">Support</span></a>
						</li>
					</ul>
				</div><!-- /.nav-collapse -->
			</div><!-- /.container -->
		</div>

	</body>

</html>